<template>
  <div>
    <!-- <span @click="getList()">车辆监控测试  {{beidouId}} - {{url}}</span> -->
  
    <iframe
      ref="iframe"
      :src="url"
      @load="embedPlugin"
      style="width: 100%; height: 100%; min-height: calc(100vh - 90px)"
    ></iframe>
  </div>
</template>

<script>
import { getConfigList, getConfig } from "@/api/system/fourConfig";

export default {
  name: "carmonitor",
  data() {
    return {
      baseurl: "http://4g.sjzhlkj.cn:9999/gps-web/h5/outside",
      menuId: "101",
      // userId: "admin_gj",
      // password: "ccf6f7b158baa9f7cea1b90a164d5ac3",
      userId: "zhatuxitong",
      password: "f86444cdd94d6562a442f8a6c65b1379",
      controls: "1111",
      url: "",
      // beidouId: '1324314552128901120',
      beidouId: '', // 车辆监控
      beidouData: null,
      typeId: '3', // 类型 车辆视频-2 车辆监控-3 车辆轨迹-4
    };
  },
  created() {
    // this.url = this.baseurl + '?menuId=' + this.menuId + '&userId=' + this.userId + '&password=' + this.password + '&controls=' + this.controls

    // this.getUrl()
    this.getList()

  },
  methods: {
    getList() {
      let queryData = {
        pageNum: 1,
        pageSize: 1000,
        // name: null,
        // fourIp: null,
        // fourInterface: null,
        // sysUserId: null,
        // associationStatus: null,
        // menuId: null,
        // status: null,
      }
      getConfigList(queryData).then(response => {
        let dataList = response.rows
        for (let i = 0; i < dataList.length; i++) {
          const item = dataList[i];
          if(item.type == this.typeId){
            this.beidouId = item.id
            this.getUrl()
          }
        }
      });
      // }
    },
    getUrl() {
      getConfig(this.beidouId).then(response => {
        this.beidouData = response.data;
        console.log(this.beidouData)
        this.url = this.beidouData.fourIp + this.beidouData.fourInterface + '&menuId=' + this.beidouData.menuId + '&userId=' + this.beidouData.usernameBD + '&password=' + this.beidouData.passwordBD 
      });
    },
    embedPlugin() {
      // 等待 iframe 加载完成
      const iframe = this.$refs.iframe;
      const doc = iframe.contentDocument || iframe.contentWindow.document;
 
      // 在这里可以操作 iframe 的 DOM
      // 例如，添加第三方网页插件需要的标签或脚本
      doc.open();
      doc.write('<script src="https://third-party-plugin.com/script.js"><\/script>');
      doc.close();
    }

  }
};
</script>
